<template>
  <div style="width: 90%; margin:0 auto;">
    <Card :style="bodyContentStyle">
      <div id="resume_top">
        <h2>简历</h2>
      </div>

      <h3>个人资料</h3>

      <div class="field">
        <h4>招聘信息来源: </h4>
        <span>{{resumeInfo.jobOrigin}}</span>
      </div>

      <div class="field" style="float: left; margin-right:10px;">
        <h4>姓名: </h4>
        <span>{{resumeInfo.realName}}</span>
      </div>

      <div class="field" style="float: left; margin-right:10px;">
        <h4>性别: </h4>
        <span>{{resumeInfo.sex}}</span>
      </div>

      <div class="field">
        <h4>现居住地: </h4>
        <span>{{resumeInfo.hometown}}</span>
      </div>

      <div class="field" style="float: left; margin-right:10px;">
        <h4>生日: </h4>
        <span>{{resumeInfo.birthday}}</span>
      </div>

      <div class="field" >
        <h4>政治面貌: </h4>
        <span>{{resumeInfo.politics}}</span>
      </div>

      <div class="field" style="float: left; margin-right:10px;">
        <h4>学历: </h4>
        <span>{{resumeInfo.degree}}</span>
      </div>

      <div class="field">
        <h4>大学: </h4>
        <span>{{resumeInfo.college}}</span>
      </div>

      <div class="field">
        <h4>手机号: </h4>
        <span>{{resumeInfo.phone}}</span>
      </div>

      <div class="field">
        <h4>邮箱: </h4>
        <span>{{resumeInfo.email}}</span>
      </div>

      <div class="field">
        <h4>自我介绍: </h4>
        <span>{{resumeInfo.selfDescription}}</span>
      </div>
      <br/>

      <h3>教育经历</h3>
      <div v-for="item in resumeInfo.education">
        <div class="field" style="float: left; margin-right:10px;">
          <h4>学校: </h4>
          <span>{{item.school}}</span>
        </div>
        <div class="field">
          <h4>专业: </h4>
          <span>{{item.major}}</span>
        </div>
        <div class="field">
          <h4>时间: </h4>
          <span>{{item.begin_time}} - {{item.end_time}}</span>
        </div>
        <br>
      </div>

      <h3>实习经历</h3>
      <div v-for="item in resumeInfo.workExperience">
        <div class="field" style="float: left; margin-right:10px;">
          <h4>公司: </h4>
          <span>{{item.company}}</span>
        </div>
        <div class="field">
          <h4>职位: </h4>
          <span>{{item.job}}</span>
        </div>
        <div class="field">
          <h4>时间: </h4>
          <span>{{item.begin_time}} - {{item.end_time}}</span>
        </div>
        <div class="field">
          <h4>职位描述: </h4>
          <span>{{item.job_desc}}</span>
        </div>
        <br>
      </div>

      <h3>项目经验</h3>
      <div v-for="item in resumeInfo.project">
        <div class="field">
          <h4>名称: </h4>
          <span>{{item.name}}</span>
        </div>
        <div class="field">
          <h4>时间: </h4>
          <span>{{item.begin_time}} - {{item.end_time}}</span>
        </div>
        <div class="field">
          <h4>项目介绍: </h4>
          <span>{{item.project_desc}}</span>
        </div>
        <div class="field">
          <h4>担任职位: </h4>
          <span>{{item.work}}</span>
        </div>
        <br>
      </div>

      <h3>语言</h3>
      <div v-for="item in resumeInfo.language">
        <div class="field" style="float: left; margin-right:10px;">
          <h4>名称: </h4>
          <span>{{item.name}}</span>
        </div>
        <div class="field">
          <h4>证书: </h4>
          <span>{{item.certificate}}</span>
        </div>
      </div>
      <br/>

      <h3>技能</h3>
      <div v-for="item in resumeInfo.skill">
        <div class="field" style="float: left; margin-right:10px;">
          <h4>名称: </h4>
          <span>{{item.name}}</span>
        </div>
        <div class="field" style="float: left; margin-right:10px;">
          <h4>时间: </h4>
          <span>{{item.time}}</span>
        </div>
        <div class="field">
          <h4>程度: </h4>
          <span>{{item.level}}</span>
        </div>
      </div>
      <br/>

      <h3>荣誉奖励</h3>
      <div v-for="item in resumeInfo.honor">
        <div class="field" style="float: left; margin-right:10px;">
          <h4>名称: </h4>
          <span>{{item.name}}</span>
        </div>
        <div class="field">
          <h4>时间: </h4>
          <span>{{item.time}}</span>
        </div>
      </div>
      <br/>

      <h3>活动经历</h3>
      <div v-for="item in resumeInfo.activity">
        <div class="field" style="float: left; margin-right:10px;">
          <h4>名称: </h4>
          <span>{{item.name}}</span>
        </div>
        <div class="field">
          <h4>时间: </h4>
          <span>{{item.time}}</span>
        </div>
      </div>
      <Spin size="large" fix v-if="spinShow"></Spin>
    </Card>

    <Button style="margin-top: 15px" type="info" long @click="handleEvaluate">面试评价</Button>

    <Button style="margin-top: 15px" type="primary" long @click="handleOver">面试完毕</Button>

    <BackTop></BackTop>

    <Modal v-model="modal_show" title="面试评价">
      <p>综合评分:</p><Rate v-model="rate_val"></Rate>
      <p>备注:</p><textarea style="width: 80%;" v-model="remark_val"></textarea>
    </Modal>

  </div>

</template>
<script>
  import interviewApi from '../api/axios/interviewApi'

  export default {
    data () {
      return {
        spinShow: true,
        modal_show: false,
        rate_val: 0,
        remark_val: '',
        bodyContentStyle: 'height:' + (window.innerHeight - 120) + 'px; overflow:scroll; position: relative;',
        resumeInfo: {
//          jobOrigin: "应届生求职网",
//          realName: "张立",
//          sex: "男",
//          hometown:"宁波",
//          birthday:"1996-01-16",
//          degree:"本科",
//          college:"杭州电子科技大学",
//          politics:"团员",
//          phone:"15958041842",
//          email:"530438645@163.com",
//          selfDescription: "1. 喜欢折腾，热爱编程 2. 为人踏实，乐于分享",
//          education: [{
//            school:"杭州电子科技大学",
//            major:"软件工程",
//            begin_time:"2014-09-11",
//            end_time:"2018-07-01"
//          }],
//          workExperience: [{
//            company:"杭州数梦工场科技有限公司",
//            job:"Java工程师",
//            job_desc:"参与支付宝城市服务项目开发，整体项目是采用SOFA_Lite的分布式框架搭建的SOA架构的企业级应用；参与系统分析文档的编写；参与诚服线上问题的排查",
//            begin_time:"2017-06-26",
//            end_time:"2017-12-26"
//          }],
//          project: [{
//            name:"基于SOFA分布式架构的城市服务",
//            project_desc:"城市服务是支付宝推出的城市基础服务平台,让人人 可以享受到线上办理服务的便利。",
//            work:"我负责的是后端模块，项目是采用SOFA_Lite分布式框架搭建的，整体使用 Spring和Mybatis，各服务之间通过SOFA_RPC的方式来进行调用，其中也涉及到了多环境部署，定时服务，消息队列的场景。",
//            begin_time:"2017-07-26",
//            end_time:"2017-09-20"
//          },{
//            name:"基于AI算法的五子棋单双人游戏",
//            project_desc:"一个支持五子棋人机和玩家对战的游戏,玩家可以邀 请对手,悔棋和认输",
//            work:"AI部分采用了一步或多步预判的算法,其中包含了博弈树的深度遍历,极小值极大值算法,Alpha-beta剪枝,棋面估分,判赢等算法;双人部分用WebSocket维护在线列表,利用字典数据结构保证玩家不重名,利用进栈出栈思想进行下棋和悔棋",
//            begin_time:"2017-06-20",
//            end_time:"2017-07-10"
//          }],
//          language: [{
//            name:"英语",
//            certificate:"CET-6"
//          }],
//          skill: [{
//            name:"Java",
//            time:"2年",
//            level:"熟练"
//          },{
//            name:"MySQL",
//            time:"2年",
//            level:"熟练"
//          },{
//            name:"Linux",
//            time:"1年",
//            level:"一般"
//          }],
//          honor: [{
//            name:"奖学金",
//            time:"2016-09-15"
//          },{
//            name:"全国大学生“互联网+”创新大赛三等奖",
//            time:"2017-03-22"
//          },{
//            name:"浙江省第五届服务外包大赛三等奖",
//            time:"2016-06-15"
//          }],
//          activity: [{
//            name:"暑期社会实践",
//            time:"2015-06-15"
//          },{
//            name:"暑期社会实践",
//            time:"2015-06-15"
//          }],
//          attributes: []
        }
      }
    },
    computed: {
      getInterviewId (){
        return this.$store.getters['auth/getInterviewId'];
      },
      getStaffId (){
        return this.$store.getters['auth/getStaffId'];
      }
    },
    methods: {
      handleEvaluate (){
        this.modal_show = true;
      },
      handleOver (){
        let that = this;
        interviewApi.finishInterview({
          id: parseInt(that.$route.params.interviewRecordId),
          interviewId: that.getInterviewId,
          userId: parseInt(that.$route.params.userId),
          staffId: that.getStaffId,
          evaluate: that.remark_val,
          score: that.rate_val
        },{
          success (res) {
            if (res.data.status === 200) {

              that.$Message.success('面试结束!');
              window.history.back();
//              that.$router.push('/interviewer');
            }else {
              console.log("finishInterview 请求失败" + res.data);
            }
          }
        });
      }
    },
    created() {
      let that = this;
      interviewApi.getResumeByUserId({
        userId: that.$route.params.userId
      },{
        success (res) {
          if (res.data.status === 200) {
            res.data.data.education = JSON.parse(res.data.data.education);
            res.data.data.workExperience = JSON.parse(res.data.data.workExperience);
            res.data.data.project = JSON.parse(res.data.data.project);
            res.data.data.language = JSON.parse(res.data.data.language);
            res.data.data.skill = JSON.parse(res.data.data.skill);
            res.data.data.honor = JSON.parse(res.data.data.honor);
            res.data.data.activity = JSON.parse(res.data.data.activity);
            res.data.data.attributes = JSON.parse(res.data.data.attributes);

            that.resumeInfo = res.data.data;

            that.spinShow = false;
          }else {
            console.log("getResumeByUserId 请求失败" + res.data);
          }
        }
      })
    }
  }
</script>
<style>
  #resume_top {
    text-align: center;
  }

  #resume_top h2 {
    margin-top:10px;
    font-size: 30px;
  }

  h3 {
    font-size: 18px;
  }

  .field {
    margin-bottom:5px;
  }

  .field h4 {
    display: inline;
    font-size: 15px;
  }

  .field span{
    font-size: 15px;
  }
</style>
